<!--
 * @Author: zqg
 * @Date: 2021-01-13 14:07:37
 * @LastEditors: zqg
 * @LastEditTime: 2021-03-16 09:40:06
 * @Description: 绩效管理
-->
<template>
  <base-layout>
    <template #searchPanel>
      <search-panel
        :addPer="'111'"
        :selectPer="'111'"
        :excelPer="'admin'"
        :financePer="'111'"
        addTitle="新增绩效规则"
        financeTitle="绩效设置"
        sendButtonTitle="本月汇总"
        @insert="addPerformance"
        @search="search"
        @finance="performanceSetting"
        @export="handleDataExport('Performance','绩效管理')"
        @send="summary"
        :showSearchButton="true"
        :showAddButton="true"
        :showExportButton="true"
        :showFinanceButton="true"
        :showSendButton="true"
      >
        <job-shop
          v-model="formDate.storeId"
          placeholder="所属门店"
        />
        <role-select
          v-model="formDate.assessRoleId"
          placeholder="职位"
        />
        <el-input
          v-model="formDate.performanceName"
          clearable
          placeholder="业绩名称"
          style="width: 200px"
        />
      </search-panel>
    </template>
    <template #contentPanel>
      <data-table
        :value="tableData"
        :total-count="totalCount"
        :has-action="true"
        :table-column-attributes="tableColumnAttributes"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :width="160"
      >
        <template #action="{row}">
          <i
            class="el-icon-info"
            title="查看规则详情"
            style="cursor: pointer;"
            @click="handleDataUpdateEdit(row, true)"
          ></i>
          <i
            class="el-icon-edit"
            title="修改绩效规则"
            style="color:red; margin-left: 20px;cursor: pointer"
            @click="handleDataUpdateEdit(row, false)"
          ></i>
        </template>
      </data-table>
      <settingDialog ref="settingDialog" />
    </template>
  </base-layout>
</template>
<script>
import baseMixin from '@/mixins/base'
import settingDialog from './components/settingDialog.vue'
import {
  page,
  setPerformanceStatus
} from '@/api/after-sale/personnel/performance'
import { getExcelDataType } from '@/api/after-sale/excelExport'
import { exportExcel } from '@/utils/index'
export default {
  components: {
    settingDialog
  },
  mixins: [
    baseMixin({
      findData: page,
      dataName: ['content', 'totalRecords']
    })
  ],
  data() {
    return {
      tableColumnAttributes: [
        { name: '所属门店', value: 'storeName', type: 'text' },
        { name: '绩效规则名称', value: 'performanceName', type: 'text' },
        { name: '职位', value: 'assessRoleValue', type: 'text' },
        { name: '指标类型', value: 'pointerType', type: 'text' },
        {
          name: '生效日期',
          type: 'render',
          render: row => {
            return `${row.startTime} 至 ${row.endTime}`
          }
        },
        {
          name: '启用状态',
          valueId: 'status',
          type: 'switch',
          action: row => {
            setPerformanceStatus(row.id).then(() => {
              this.setTableData()
            })
          }
        }
      ],
      formDate: {
        // 门店id
        storeId: '',
        // 职位id
        assessRoleId: '',
        performanceName: ''
      }
    }
  },
  methods: {
    /**
     * @description: 查询
     * @param {*}
     * @return {*}
     */
    search() {
      this.searchOptions = this.formDate
      this.currentPage = 1
      this.setTableData()
    },
    /**
     * @description: 新增/编辑业绩
     * @param {Object | null} 规则信息
     * @param {boolean} 新增/编辑业绩是否禁用
     * @return {*}
     */
    addPerformance(row = null, isDisabled = false) {
      this.$router.push({
        path: '/personnel/addPerformance',
        query: {
          rulesId: row ? row.id : '',
          diabled: isDisabled ? 'diabled' : ''
        }
      })
    },
    handleDataUpdateEdit(row, diabled) {
      this.addPerformance(row, diabled)
    },
    /**
     * @description: 绩效设置
     * @param {*}
     * @return {*}
     */
    performanceSetting() {
      this.$refs.settingDialog.open()
    },
    /**
     * @description: 本月汇总
     * @param {*}
     * @return {*}
     */
    summary() {
      this.$refs.settingDialog.open(2)
    },
    /**
     * @description: 导出
     * @param {*}
     * @return {*}
     */
    handleDataExport() {
      getExcelDataType().then(res => {
        exportExcel(res.data.Performance, '绩效管理', this.formDate, this.pageSize, this.currentPage)
      })
    }
  }
}
</script>
